<!--
 * @Author: HuangBingQuan <17671241237@163.com>
 * @Date: 2024-12-25 11:07:27
 * @LastEditTime: 2025-01-15 22:17:37
 * @FilePath: /low-code-platform/src/views/Home/index.vue
-->
<template>
    <div class="container pt-20 pb-20 pl-20 pr-20">
        <h1 class="font-weight-100 text-center">XQ问卷系统</h1>
        <div class="mb-15">
            <el-button type="primary" :icon="Plus" @click="goToEditor">创建问卷</el-button>
            <el-button type="success" :icon="Compass" @click="goToComMarket">组件市场</el-button>
        </div>
        <el-table :data="tableData" style="width: 100%" border>
            <el-table-column
                fixed
                prop="createDate"
                label="创建日期"
                width="150"
                :formatter="formatDate"
            />
            <el-table-column prop="title" label="问卷标题" />
            <el-table-column prop="surveyCount" label="题目数" width="150" align="center" />
            <el-table-column
                prop="updateDate"
                label="最近更新日期"
                width="150"
                align="center"
                :formatter="formatDate"
            />
            <el-table-column fixed="right" label="操作" width="300" align="center">
                <template #default="scope">
                    <el-button link type="primary" size="small" @click="viewSurvey(scope.row)"
                        >查看问卷</el-button
                    >
                    <el-button link type="primary" size="small" @click="editSurvey(scope.row)"
                        >编辑</el-button
                    >
                    <el-button link type="primary" size="small" @click="delSurvey(scope.row)"
                        >删除</el-button
                    >
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script setup lang="ts">
import { Compass, Plus } from '@element-plus/icons-vue';
import { ref, onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router';

const tableData = ref([]);
const route = useRoute();
const router = useRouter();

const goToEditor = () => {
    router.push('/editor');
    console.log('创建问卷-------->');
};

const goToComMarket = () => {
    router.push('/materials');
    console.log('组件市场--------->');
};

onMounted(() => {
    console.log('------>', route);
    console.log('------>', router);
});
</script>

<style scoped></style>
